<template>
    <div class='app-content customer-registration customer-belong'>
        <div class="app-view">
            <van-field 
                v-model="form.mobile"
                label-width="1.9rem" 
                type="number"
                placeholder="请输入手机号码（11位）"
                clearable
            >
                <template #left-icon>
                    <i class="iconfont icon-shouji"></i>
                </template>
                <template #label>
                    <country-code v-model="form.countryCode"></country-code>
                </template>
                <template #right-icon>
                    <i class="iconfont icon-sousuo"></i>
                </template>
            </van-field>
        </div>
        <div class="app-view">
            <div class="adviser-info">
                <avatar class="avatar" :src="src"></avatar>
                <div class="con">
                    <div class="name">
                        <div class="text">归属顾问：吴瑞丽</div>
                        <div class="state"><span class="signed">已签到</span></div>
                    </div>
                    <div class="sub">北京销售团队</div>
                </div>
            </div>
            <van-divider :style="{color:'#e5e5e5',margin:0}"/>
            <div class="customer-info">
                <ul>
                    <li>
                        <div class="tit">客户姓名</div>
                        <div class="text">李峰（男）</div>
                    </li>
                    <li>
                        <div class="tit">电话号码</div>
                        <div class="text">159****1023</div>
                    </li>
                    <li>
                        <div class="tit">上次跟进</div>
                        <div class="text">2021-10-15  09:25:20</div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="app-view">
            <div class="no-data">
                <div class="iconfont icon-suijiyonghu"></div>
                <div class="txt">请输入客户手机号码查询原归属顾问</div>
            </div>
        </div>
    </div>
</template>

<script>
import CountryCode from "@/components/CountryCode/index.vue";
import avatar from "@/components/Avatar/index.vue"
export default {
    name: '',
    data() { 
        return {
            form:{},
            src:require("@/assets/images/photo.png"),
        }
    },
    props: {

    },
    components:{
        CountryCode,
        avatar
    },
    mounted() {

    },
    methods:{

    },
}
</script>

<style lang='scss' scoped>
.customer-belong{
    margin-top:0.9rem;
    .adviser-info{
        padding:0.9rem 1.1rem;
        display:flex;
        align-items: center;
        .avatar{
            width:2.45rem;
            height:2.45rem;
        }
        .con{
            margin-left:0.5rem;
            line-height: 1;
            .name{
                font-size:0.4rem;
                display:flex;
                align-items: center;
                .state{
                    margin-left:0.3rem;
                    border-radius: 3px;
                    overflow: hidden;
                    .signed{
                        display:block;
                        padding:0 0.15rem;
                        font-size:0.28rem;
                        line-height: 0.45rem;
                    }
                }
            }
            .sub{
                font-size:0.34rem;
                color:#999;
                margin-top:0.4rem;
            }
        }
    }
    .customer-info{
        padding:0.9rem 1.1rem;
        ul{
            li{
                overflow: hidden;
                font-size:0.34rem;
                line-height: 0.6rem;
                padding:0.15rem 0;
                .tit{
                    float:left;
                    width:2rem;
                }
                .text{
                    float:none;
                    overflow: hidden;
                }
            }
        }
    }
    .no-data{
        display:flex;
        flex-direction: column;
        align-items: center;
        padding:2.5rem 0;
        .iconfont{
            font-size:1.8rem;
            color:#d9d9d9;
        }
        .txt{
            font-size:0.34rem;
            color:#999999;
            margin-top:0.4rem;
        }
    }
}
</style>